<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../style/fjol_style.css" rel="stylesheet" />
		<link href="../style/xol_style.css" rel="stylesheet" />
	</head>
	<style>
		#buildingHouseTypePageList .mui-active{
			background: none;
			border: none;
		}
	</style>
	<body>
		<header class="mui-bar mui-bar-nav newbgRed">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">楼盘详情</h1>
		</header>
		<div class="mui-scroll-wrapper" style="bottom: 108px; top: 45px;">
			
		    <div class="mui-scroll">
		        <!--这里放置真实显示的DOM内容-->
		        
		        <div id="newHouseContent" class="rel">
		        	
		        </div>
		        
		    </div>
		</div>
		<div class="mui-bar mui-bar-tab house-detail-footer">
			<div class="mui-pull-left mt5" style="margin-right: 1%; width: 24%;">
				<img src="../images/icon_default_header@2x.png" id="agentImg" height="100" style="max-width: 100%;"/>
			</div>
			<div class="mui-pull-right" style="width: 74%;">
				<div class="agent" id="agentBox">
					
				</div>
				<div class="" id="houseListFooter">
					<a class="mui-tab-item" id="groupBuy">
				        <span class="mui-icon house-icon house-tuan-icon"></span>
				        <span style="color: #fdb181;">团购报名</span>
				    </a>
				    <a class="mui-tab-item" id="cutPrice">
				        <span class="mui-icon house-icon house-cutprice-icon"></span>
				        <span style="color: #6ca4e6;">短信</span>
				    </a>
				    <a class="mui-tab-item" id="newhouseAppointment">
				        <span class="mui-icon house-icon house-appoint-icon"></span>
				        <span class="newRed">预约看房</span>
				    </a>
				</div>
			</div>
		</div>
		
		<script src="../js/mui.min.js"></script>
		<script src="../js/jquery-2.1.0.js"></script>
		<script src="../js/jquery.tmpl.min.js"></script>
		<script src="../js/md5.js"></script>
		<script src="../js/common.util.js"></script>
		<script src="../js/network.js"></script>
		<script src="../js/fj_base_data.js"></script>
		<script type="text/javascript" src="../js/xzx.open.js"></script>
		
		<script id="agentBoxTmpl" type="text/x-jquery-tmpl">
			{{if realname}}
			${realname} 
			{{else}}
			经纪人
			{{/if}}
			<span>
				{{each $item.agentStarFull()}}
		    	<i data-index='0' class="mui-icon mui-icon-star-filled"></i>
		    	{{/each}}
		    	{{if $item.agentStarHalf()}}
				<i data-index='1' class="mui-icon mui-icon-starhalf"></i>
				{{/if}}
				{{each $item.agentStar()}}
				<i data-index='2' class="mui-icon mui-icon-star"></i>
				{{/each}}
			</span>
		</script>
		
		<script id="contIdTmpl" type="text/x-jquery-tmpl">
			<div class="bg-white">
				<div class="mui-text-center">
					{{if coverImage}}
		        	<img src="${coverImage}" width="100%" id="openPhotoList"/>
		        	{{else}}
		        	<img src="../images/icon_blank@2x.png" style="max-width: 100%; height: 200px;" id="openPhotoList"/>
		        	{{/if}}
				</div>
				
		        <h4 class="p10">${name}</h4>
		        <div class="mui-clearfix p10">
		        	<span>均价 ${averagePrice}元/㎡</span>
		        	<p class="mui-pull-right">${buildType}</p>
		        </div>
		        <div class="p10 mt5 flex">
		        	<span class="flexCell">${address}</span>
		        	<span class="mui-icon f10" id="shareHouse">
				    	<img src="../imageNew/icon_share@2x.png" height="15"/><em class="newRed vm">分享</em>
				    </span>
		        </div>
	        </div>
	        
	        <ul class="mui-table-view">
	                <li class="mui-table-view-cell" id="buildingPeriodPage">
	                    <a class="mui-navigate-right">
	                        开盘时间
	                    </a>
	                </li>
	                <li class="mui-table-view-cell" id="saleLicense">
	                    <a class="mui-navigate-right">
	                         预售许可
	                    </a>
	                </li>
	                <li class="mui-table-view-cell" id="newHouse_message">
	                    <a class="mui-navigate-right">
	                         更多
	                    </a>
	                </li>
	            </ul>
	            
	            <div class="bg-white mt10">
	            	<div class="mui-clearfix bd9 p10 pt10">
	            		<span>户型介绍</span>
	            		<p class="mui-pull-right" id="allHouseType">全部户型></p>
	            	</div>
	            	<div class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted" style="min-height: 200px; background: #FFFFFF;">
						<ul class="mui-scroll p0" style="height: 100%; padding-left: 0;" id="buildingHouseTypePageList">
							
						</ul>
					</div>
				
	            </div>
	            
		        <!--2018-01-03新增图文详情-->
		        <div class="mt10 bg-white">
			        <h4 class="pt5 pb5 p10 bd9">图文详情</h4>
			        <div id="houseDetail" class="pt5 p10">
			        	
			        </div>
		        </div>
		        
						<div class="mt10 bg-white p10">
							<h5 class="pt10 pb10">位置信息</h5>
							<div id="map" style="height: 300px;">
	                			<!--地图加载中...-->
	                			<img src="http://api.map.baidu.com/staticimage/v2?ak=fVAHnxI5Y6IsMD0ZXwzjaHzxjrC1pk5k&mcode=666666&center=${longitude},${latitude}&width=320&height=300&zoom=11&markers=${longitude},${latitude}" style="width: 100%; height: 100%;"/>
	                		</div>
						</div>
		</script>
		<script id="buildingHouseTypePageTmpl" type="text/x-jquery-tmpl">
			<li class="mui-control-item mui-text-left tuijian-list" id="${id}">
				<div class="mui-text-center">
					<div>
						<!--<span class="mui-badge mui-badge-green mui-badge-inverted">【在售】</span>-->
						${title}</div>
					<img class="mui-media-object" src="${coverImage}" height=88 />
					<div style="white-space: normal;">
						<p style="margin: 0;">${bedRoomNumber}室${livingRoomNumber}厅${square}㎡</p>
					</div>
				</div>
			</li>
		</script>
		<script type="text/javascript">
			mui.init();
			
			mui.plusReady(function(){
				var wv = plus.webview.currentWebview();
				var buildingId = wv.buildingId;
				var userInfo = common.myStorage.getItem('userInfo');
				var param;
				var mobile = '4009183588';
			if(userInfo){
				param = [{
					key:'buildingId',
					value:buildingId
				},{
					key:'clientId',
					value:userInfo.clientId
				}];
			}else{
				param = [{
						key:'buildingId',
						value:buildingId
					}];
			}
			
				fjNetwork.get('fjzx/common/building-detail.json',param,function(data){
					console.log(JSON.stringify(data.building));
					var rows = data.building;		//楼盘信息
					var saleman = data.saleman;		//业务员信息
//					console.log(JSON.stringify(data));
					if(saleman){
						mobile = saleman.mobile;
						document.querySelector('#agentImg').src = saleman.headImgUrl;
					}else{
						mobile = '4009183588';
						document.querySelector('#agentImg').src = '../images/icon_default_header@2x.png';
					}
					$('#contIdTmpl').tmpl(rows).appendTo('#newHouseContent');
					$('#houseDetail').html(rows.description);
					$('#houseDetail p').css('color','#333333');
					
					//业务员信息
					$('#agentBoxTmpl').tmpl(saleman,{
					agentStarFull: function(){
						var commentScore = this.data.commentScore?this.data.commentScore:0;
						var commentTotal = this.data.commentTotal?this.data.commentTotal:0;
						var score = commentTotal==0?0 : parseInt(commentScore/commentTotal);
						var starStr = [];
//						console.log(commentScore);
						starStr.length = parseInt(score);
						return starStr;
					},
					agentStarHalf: function(){
						var commentScore = this.data.commentScore?this.data.commentScore:0;
						var commentTotal = this.data.commentTotal?this.data.commentTotal:0;
						var score = commentTotal==0?0 : parseInt(commentScore/commentTotal);
						var halfScore = parseInt(score);
						if(halfScore>score){
							return true;
						}else{
							return false;
						}
					},
					agentStar: function(){
						var commentScore = this.data.commentScore?this.data.commentScore:0;
						var commentTotal = this.data.commentTotal?this.data.commentTotal:0;
						var score = commentTotal==0?0 : parseInt(commentScore/commentTotal);
						var rest = parseInt(5-score);
						var starStr = [];
						starStr.length = parseInt(rest);
						return starStr;
					}
				}).appendTo('#agentBox');
					
					var houseType = data.buildingHouseTypePageList;//房屋类型、户型 array
					var saleLicense = data.buildingSaleLicenseList;//预售许可证 array
					var buildingPeriodPage = data.buildingPeriodPageList;//开盘时间array
					var buildingHouseTypePageList = data.buildingHouseTypePageList;//户型
//					for (var i=0; i<buildingHouseTypePageList.length; i++) {
//						if(i==3){
//							break;
//						}
						$('#buildingHouseTypePageTmpl').tmpl(buildingHouseTypePageList).appendTo('#buildingHouseTypePageList');
//					}
					
//					console.log(saleLicense);
					var buildingDate = new Date(rows.publicDate).toLocaleString();
					var buildingPeriodTime = buildingDate?buildingDate:'未知';		//开盘时间
					
					var buildDate = new Date(rows.buildDate).toLocaleDateString();
					var buildDateTime = buildDate?buildDate:'未知';		//建筑时间
					
					var deliverDate = new Date(rows.deliverDate).toLocaleDateString();
					var deliverDateTime = buildDate?deliverDate:'未知';		//交房时间
					var buildingArr = [{
						key:'楼盘名',
						value:rows.name
					},{
						key:'地区',
						value:rows.area?rows.area:'未知'
					},{
						key:'地址',
						value:rows.address?rows.address:'未知'
					},{
						key:'均价',
						value:rows.averagePrice+'元/㎡'
					},{
						key:'楼盘类型',
						value:rows.buildType?rows.buildType:'未知'
					},{
						key:'建筑类型',
						value:rows.buildType?rows.buildType:'未知'
					},{
						key:'建筑面积',
						value:(rows.buildingSquare?rows.buildingSquare:0)+'㎡'
					},{
						key:'占地面积',
						value:(rows.coverAreaSquare?rows.coverAreaSquare:0)+'㎡'
					},{
						key:'容积率',
						value:rows.plotRatio?rows.plotRatio:'未知'
					},{
						key:'绿化率',
						value:rows.greeningRate?rows.greeningRate:'未知'
					},{
						key:'规划户数',
						value:rows.householdCount?rows.householdCount:'未知'
					},{
						key:'开发商',
						value:rows.developer?rows.developer:'未知'
					},{
						key:'售楼部地址',
						value:rows.address?rows.address:'未知'
					},{
						key:'建筑年份',
						value:buildDateTime
					},{
						key:'开盘时间',
						value:buildingPeriodTime
					},{
						key:'预计交房时间',
						value:deliverDateTime
					},{
						key:'物业公司',
						value:rows.propertyCompany?rows.propertyCompany:'未知'
					},{
						key:'物业费',
						value:rows.propertyCosts?rows.propertyCosts:'未知'
					},{
						key:'车位比例',
						value:rows.parkRatio?rows.parkRatio:'未知'		//停车率
					},{
						key:'车位情况',
						value:rows.parkDesc?rows.parkDesc:'未知'
					},{
						key:'小区管理',
						value:rows.managerTypeName?rows.managerTypeName:'未知'
					},{
						key:'供水方式',
						value:rows.waterMethod?rows.waterMethod:'未知'
					},{
						key:'供电方式',
						value:rows.electricMethod?rows.electricMethod:'未知'
					},{
						key:'所属街道',
						value:rows.street?rows.street:'未知'
					},{
						key:'所属社区',
						value:rows.community?rows.community:'未知'
					},{
						key:'是否能入户口',
						value:rows.intoAccount?'有户口':'否'
					},{
						key:'就读小学',
						value:rows.primarySchool?rows.primarySchool:'未知'
					},{
						key:'就读中学',
						value:rows.middleSchool?rows.middleSchool:'未知'
					},{
						key:'嫌恶设施',
						value:rows.dislikeBuilding?rows.dislikeBuilding:'未知'
					}];
					
					var albumList = data.albumList;
					//打开图册
					document.querySelector('#openPhotoList').addEventListener('tap',function(){
						openWindowWithPage('newHouse_photolist',{
							albumList:albumList
						});
					});
					
					//开盘时间
					document.querySelector('#buildingPeriodPage').addEventListener('tap',function(){
						openWindowWithPage('buildingPeriodPage',{
							buildingPeriodPage:buildingPeriodPage
						});

					});
					
					//更多信息
					document.querySelector('#newHouse_message').addEventListener('tap',function(){
						openWindowWithPage('newHouse_message',{
							buildingArr:buildingArr,
							buildingName:rows.name
						});

					});
					
					//预售许可
					document.querySelector('#saleLicense').addEventListener('tap',function(){
						openWindowWithPage('saleLicense',{
							saleLicense:saleLicense
						});

					});
					
					//全部户型
					document.querySelector('#allHouseType').addEventListener('tap',function(){
						openWindowWithPage('buildingHouseType',{
							buildingHouseTypePageList:buildingHouseTypePageList
						});

					});
					
					//户型详情
					mui('#buildingHouseTypePageList').on('tap','li',function(){
						openWindowWithPage('layout_detail',{
							listData:buildingHouseTypePageList,
							buildingId:buildingId
						});
						
					});
					
					//查看地图
					document.querySelector('#map img').addEventListener('tap',function(){
						openFileWindowWithPage('..','fj_house_map',{
							longitude:rows.longitude,
								latitude:rows.latitude,
								buildingName:rows.name
						});

				});
				//团购报名
				document.querySelector('#groupBuy').addEventListener('tap',function(){
					openFileWindowWithPage('../selle_house','fj_house_issue',{
						type:4,
						buildingId:buildingId
					});
				});
				document.addEventListener('groupBuyEvent',function(e){
					plus.webview.currentWebview().reload();
					mui.toast('团购报名成功');
//					console.log('团购报名成功');
				});
				//短信
				document.querySelector('#cutPrice').addEventListener('tap',function(e){

						e.detail.gesture.preventDefault(); //修复iOS 8.x平台存在的bug，使用plus.nativeUI.prompt会造成输入法闪一下又没了
						var btnArray = ['取消', '确定'];
						var msg = plus.messaging.createMessage(plus.messaging.TYPE_SMS);
						msg.to = [mobile];
						msg.body = '你好，我对“鑫在线”APP上的'+rows.name+'楼盘很感兴趣，希望作进一步了解，请及时与我取得联系，谢谢。';
						plus.messaging.sendMessage( msg,function(){
							//success
						},function(){
							//error
						} );

					
				});
					
					//预约看房
					document.querySelector('#newhouseAppointment').addEventListener('tap',function(){
						if(userInfo){
							var appointTime = new Date().toLocaleString().replace(',','');
							var param = [{
								key:'buildingId',
								value:buildingId
							},{
								key:'clientId',
								value:userInfo.clientId
							},{
								key:'reserveDate',
								value:appointTime
							}];
//							console.log(appointTime);
							fjNetwork.post('fjzx/client/add-new-building-reserve.json',param,function(data){
								mui.toast(data.msg);
								
							},function(msg){
								mui.toast(msg);
							});
						}else{
							mui.confirm('请先登录','提示',['立即登录','取消'],function(e){
							if(e.index == 0){
								openFileWindowWithPage('personal_pages','login');
							}
							});
						}
						mui.confirm('联系经纪人:'+mobile+'？','预约电话',['直接拨打','稍后联系'],function(e){
							if(e.index == 0){
								plus.device.dial(mobile, false);
							}
							
						});
					});
					
					mui('.mui-scroll-wrapper').scroll({
						deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
					});
					
					
					//分享
			document.querySelector('#shareHouse').addEventListener('tap',function(){
//				console.log(houseTitle);
				var userInfo = common.myStorage.getItem('userInfo');
				var ids = [{
                    id: "weixin", 
                    ex: "WXSceneSession"  /*微信好友*/
                }, {
                    id: "weixin",
                    ex: "WXSceneTimeline" /*微信朋友圈*/
                }
//              , {
//                  id: "qq"   /*QQ好友*/
//              }
                ],
                bts = [{
                    title: "发送给微信好友"
                }, {
                    title: "分享到微信朋友圈"
                }
//              , {
//                  title: "分享到QQ"
//              }
                ];
	            plus.nativeUI.actionSheet({
	                    cancel: "取消",
	                    buttons: bts
	                },
	                function(e) {
	                    var i = e.index;
	                    if (i > 0) {
	                        shareAction(ids[i - 1].id, ids[i - 1].ex,buildingId,userInfo,rows.name);
	                    }
	                }
	            );
			});
			
			/*更新分享服务*/
			updateSerivces();
			
			
				},function(msg){
//					console.log(msg);
					mui.alert(msg);
				});
			})
			Date.prototype.toLocaleString = function() {
	          return this.getFullYear() + "-" + (this.getMonth() + 1) + "-" + this.getDate() + ", " + this.getHours() + ":" + this.getMinutes() + ":" + this.getSeconds();
	    };
	    
	    /**
         * 分享操作
         */
        function shareAction(id, ex,buildingId,userInfo,houseTitle) {
            var s = null;
            if (!id || !(s = shares[id])) {
                outLine("无效的分享服务！");
                return;
            }
            if (s.authenticated) {
                outSet("---已授权---");
                shareMessage(s, ex,buildingId,userInfo,houseTitle);
            } else {
                outSet("---未授权---");
                s.authorize(function() {
                    shareMessage(s, ex,buildingId,userInfo,houseTitle);
                }, function(e) {
                    outLine("认证授权失败");
                });
            }
        }
        /**
         * 发送分享消息
         */
        function shareMessage(s, ex, buildingId,userInfo,houseTitle) {
        	
            var msg = {
                content: '分享-鑫在线',
                href: 'http://www.xinzhongzheng.com/mobile/share_new_building?buildingId='+buildingId,
                title: houseTitle,
                content: '房产 装修 家政 生活',
                thumbs: ['images/logo512x512.png'],
                pictures: ['images/logo512x512.png'],
                extra: {
                    scene: ex
                }
            };
            s.send(msg, function() {
                outLine("分享成功!");
                
                //登录状态下 分享成功增加积分
                if(userInfo){
                	shareSuccess(userInfo);
                }
                
            }, function(e) {
                outLine("分享失败!");
            });
        }
        /**
         * 更新分享服务
         */
        function updateSerivces() {
            plus.share.getServices(function(s) {
                shares = {};
                for (var i in s) {
                    var t = s[i];
                    shares[t.id] = t;
                }
                outSet("获取分享服务列表成功");
            }, function(e) {
                outSet("获取分享服务列表失败：" + e.message);
            });
        }
        // 控制台输出日志
        function outSet(msg) {
            console.log(msg);
        }
        // 界面弹出吐司提示
        function outLine(msg) {
            mui.toast(msg);
        }
        /*分享成功*/
       function shareSuccess(userInfo){
//	       	console.log(userInfo.clientId);
	       	var shareParam = [{
	        	key:'clientId',
	        	value:userInfo.clientId
	        }]
	        fjNetwork.post('fjzx/client/add-app-share-integral.json',shareParam,function(data){
//	        	console.log(JSON.stringify(data));
	        });
       }
		</script>
	</body>

</html>